<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="author" content="lz">
    <title></title>
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="yejiao.css">
    <link rel="stylesheet" href="gouwuche.css">
    <style>
        .icon1{
            background-position: 0 -700%;
        }
        .icon3{
            background-position: 0 -200%;
        }
        body{
            background-color: #eee;
            margin-bottom: 65px;
            margin-top: 53px;
        }
    </style>
</head>
<body>

    <header id="nav">
        <div>
            <img src="分类/images/icon_back_n.png" alt="">
            <span>购物车</span>
            <img src="搜索/images/search.png" alt="">
        </div>
    </header>

    <div class="dl">
        <span>登录后享受更多优惠</span>
        <span>去登录&gt</span>
    </div>

    <section class="gwck">
        <img src="购物车/images/empty.png" alt="">
        <span>购物车还是空的</span>
        <span>去逛逛</span>
    </section>

    <section class="wntj">
        <div>为你推荐</div>
        <section class="nr">
            <div>
                <img src="分类/images/product1.png" alt="">
                <div>小米Max</div>
                <div><sup>￥</sup>1299</div>
            </div>
            <div>
                <img src="分类/images/product5.png" alt="">
                <div>小米note3</div>
                <div><sup>￥</sup>999</div>
            </div>
        </section>

         <section class="nr">
            <div>
                <img src="分类/images/product2-1.png" alt="">
                <div>笔记本14"</div>
                <div><sup>￥</sup>4299</div>
            </div>
            <div>
                <img src="分类/images/product2-3.png" alt="">
                <div>小米平板</div>
                <div><sup>￥</sup>1999</div>
            </div>
        </section>

         <section class="nr">
            <div>
                <img src="分类/images/product3-1.png" alt="">
                <div>小米电视60"</div>
                <div><sup>￥</sup>4299</div>
            </div>
            <div>
                <img src="分类/images/product3-5.png" alt="">
                <div>小米电视40"</div>
                <div><sup>￥</sup>2999</div>
            </div>
        </section>

         <section class="nr">
            <div>
                <img src="分类/images/product4-1.png" alt="">
                <div>小米净化器</div>
                <div><sup>￥</sup>699</div>
            </div>
            <div>
                <img src="分类/images/product4-5.png" alt="">
                <div>小米路由</div>
                <div><sup>￥</sup>199</div>
            </div>
        </section>

         <section class="nr">
            <div>
                <img src="分类/images/product5-1.png" alt="">
                <div>小米充电宝</div>
                <div><sup>￥</sup>99</div>
            </div>
            <div>
                <img src="分类/images/product5-5.png" alt="">
                <div>小米数据线</div>
                <div><sup>￥</sup>9.9</div>
            </div>
        </section>

         <section class="nr">
            <div>
                <img src="分类/images/product6-1.png" alt="">
                <div>小米胶囊耳机</div>
                <div><sup>￥</sup>69</div>
            </div>
            <div>
                <img src="分类/images/product6-5.png" alt="">
                <div>小米扣儿</div>
                <div><sup>￥</sup>139</div>
            </div>
        </section>
         <section class="nr">
            <div>
                <img src="分类/images/product7-1.png" alt="">
                <div>小米周刊</div>
                <div><sup>￥</sup>4.9</div>
            </div>
            <div>
                <img src="分类/images/product7-5.png" alt="">
                <div>小米行李箱</div>
                <div><sup>￥</sup>299</div>
            </div>
        </section>
         <section class="nr">
            <div>
                <img src="分类/images/product8-1.png" alt="">
                <div>小米手机壳</div>
                <div><sup>￥</sup>49</div>
            </div>
            <div>
                <img src="分类/images/product8-3.png" alt="">
                <div>小米后盖</div>
                <div><sup>￥</sup>29</div>
            </div>
        </section>
         <section class="nr">
            <div>
                <img src="分类/images/product9-1.png" alt="">
                <div>小米充电宝组合</div>
                <div><sup>￥</sup>129</div>
            </div>
            <div>
                <img src="分类/images/product9-2.png" alt="">
                <div>小米手环</div>
                <div><sup>￥</sup>79</div>
            </div>
        </section>
    </section>







<footer>
<nav>
    
        <a href="首页.html" >
            <div class="tpjl icon1"></div>
            <div>首页</div>
        </a>
        <a href="分类.html" >
            <div class="tpjl icon2"></div>
            <div>分类</div>
        </a>
        <a href="#" >
            <div class="tpjl icon3"></div>
            <div>购物车</div>
        </a>
        <a href="我的.html" >
            <div class="tpjl icon4"></div>
            <div>我的</div>
     
    </div>
</nav>
</footer>

    <script src="bootstrap/js/jquery-3.1.1.min.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>